import { debounce } from '@/utils'

export default {
  data() {
    return {
      timer: null,
      elWidth:0,
      elHeight:0,
    }
  },
  mounted() {
    this.initListener()
    this.timer = setInterval(() => {
      this.isReize();//
    }, 1000)
  },
  activated() {
    if (!this.$_resizeHandler) {
      // avoid duplication init
      this.initListener()
    }
    // when keep-alive chart activated, auto resize
    this.resize()
  },
  beforeDestroy() {
    // this.destroyListener()
    clearInterval(this.timer);
  },
  deactivated() {
    this.destroyListener()
  },
  methods: {
    $_sidebarResizeHandler(e) {
      if (e.propertyName === 'width') {
        this.$_resizeHandler()
      }
    },
    initListener() {
      this.$_resizeHandler = debounce(() => {
        this.resize()
      }, 50)
    },
    resize() {
      const { chart,maxHeight } = this
      chart && chart.resize()
      maxHeight && this.tableresize()
    },
    isReize() {
      const style = getComputedStyle(this.$parent.$el);
      if (this.elWidth !== style.width || this.elHeight !== style.height) {
        this.elWidth = style.width;
        this.elHeight = style.height;
        this.resize()
      }
    },
  }
}
